import {Component, OnInit} from '@angular/core';
import {ControllerItem, Type} from '../../entity/Whiteboard';
import {EventService, EventSource} from '../../services/event.service';
import {CdkDragEnd, CdkDragMove, CdkDragStart} from '@angular/cdk/drag-drop';
import {ClickMode} from '../../entity/TT';


@Component({
  selector: 'app-controller',
  templateUrl: './controller.component.html',
  styleUrls: ['./controller.component.scss']
})
export class ControllerComponent implements OnInit {

  items: ControllerItem[] = [
    {name: 'Move', type: Type.MOVE, isShow: true, isActived: false, clickMode: ClickMode.Push},
    {name: 'Mute', type: Type.MUTE, isShow: false, isActived: false, clickMode: ClickMode.Push},
    {name: 'Reward', type: Type.GIFT, isShow: false, isActived: false, clickMode: ClickMode.Normal},
    {name: 'Return', type: Type.RE, isShow: false, isActived: false, clickMode: ClickMode.Normal},
    {name: 'Whiteboard', type: Type.WB, isShow: false, isActived: false, clickMode: ClickMode.Push},
    {name: 'OK',  type: Type.OK, isShow: false, isActived: false, clickMode: ClickMode.Normal},
    {name: 'Select All', type: Type.ALL, isShow: false, isActived: false, clickMode: ClickMode.Push},
  ];

  isMoving = false;


  constructor(private eventService: EventService) { }

  ngOnInit() {
  }

  onSelectItem(item: ControllerItem) {
    if (this.isMoving) {
      return;
    }

    const act: boolean =  !item.isActived;
    if (item.clickMode === ClickMode.Push) {
      item.isActived = act;
    }

    switch (item.type) {
      case Type.MOVE: {
        for (const it of this.items) {
          if (it !== item) {
            it.isShow = item.isActived;
          }
        }
        break;
      }

      case Type.ALL: {
        this.eventService.sendSelectAll(act);
        break;
      }

      case Type.MUTE:
        this.eventService.sendMute(act);
        break;

      case Type.WB:
        this.eventService.sendWhiteBoard(act);
        break;

      case Type.GIFT:
        this.eventService.sendGiftCoin(2);
        break;

      case Type.RE:
        this.eventService.sendEvent(EventSource.PARTICIPANT_GO_HOME, true);
        break;

      case Type.OK:
        this.eventService.sendGiftFabulous(1);
        break;
    }
  }


  dragStarted(event: CdkDragStart) {
    this.isMoving = true;
  }

  dragEnded(event: CdkDragEnd) {
    setTimeout(() => {
      this.isMoving = false;
    }, 400);
  }

  dragMoved(event: CdkDragMove) {
  }
}
